(function () {
    $.fn.extend({
        mouse() {
            class Swiper {
                constructor(el) {
                    this.el = el;
                    this.$index;
                    this.oul = this.el.find("ul");
                    this.ool = this.el.find("ol");
                    //图片的下标
                    this.imgindex = 0;
                    //点的小标
                    this.pointindex = 0;
                    this.init();
                    this.mouseEvent();
                    this.click();

                }
                init() {


                    //让ol 添加点 (图片多一张 所以要减一)
                    for (let i = 0; i < this.oul.children().length; i++) {
                        //用字符串模板创建li标签
                        $(`<li class=${i == 0 ? 'current' : ''}></li>`).appendTo(this.ool);
                    }

                }

                mouseEvent() {
                    this.el.mouseenter(() => {
                        this.el.find("#arr>span").show();
                    }).mouseleave(() => {
                        this.el.find("#arr>span").hide();
                    })
                }
                click() {
                    let that = this;
                    this.el.on("click", "ol>li", function () {
                        that.$index = $(this).index();
                        that.el.find("ul").children().eq(that.$index).addClass("aaa").siblings().removeClass("aaa");
                        that.el.find("ol").children().eq(that.$index).addClass("current").siblings().removeClass("current");
                        that.imgindex=that.$index;
                    })
                    $("#all").on("click", "#arr", (e) => {
                        if (e.target.className == "left")
                            this.imgindex--;
                        if (this.imgindex < 0)
                            this.imgindex = 4;
                        if (e.target.className == "right")
                            this.imgindex++;
                        if (this.imgindex > 4)
                            this.imgindex = 0;
                        this.el.find("ul").children().eq(this.imgindex).addClass("aaa").siblings().removeClass("aaa");
                        this.el.find("ol").children().eq(this.imgindex).addClass("current").siblings().removeClass("current");
                    })
                }
            }
            new Swiper(this)
        }
    })
})()
$(function () {
    $(window).load(function () {
        $(".banner").mouse();
    })
})



